Now that I know who my users will be and what they want as well as what they need, its time to find out who is out there and how I can do it better! I researched the competitor apps online, on social media, on multiple devices, investor information  and in the news to get a big picture idea about who they are and what they are doing.

While I created more than two personas for this project I am going to focus here on the main two, Caroline and Phillip. ( Personas inspired by Yaroslav Zubko. )

Now we know who we are designing for. That means it is time to figure out the business goals and desired outcomes for Caroline, Phillip and our Artist/Studios.

I created many Task Analysis and User Flows for this project. As an example I am focusing on one core component of the app, searching artists and studios, and demonstrating how my persona Phillip might use this feature.

Now that I have a solid idea what this app needs to do, its time to build it! Step 1, Create a site map. Step 2, gather some feedback from potential users on what their expectations are for the app layout. I created an open card sort aimed at defining grouping for the main pages in the app using a digital card sort by Optimal Workshop. 

Step 3, analyze results so that I can refine my site map for better usability.

Now That I have a clear idea about the screens I needed to design I was finally ready to begin wireframing. I started with low fidelity wireframes drawn by hand and continued to sort and organize them to further develop the architecture of Ink Tank. When I felt confident with what I had I designed mid fidelity wireframes using Balsamiq software.

After I finished refinements in the mid fi wireframes and checked them against my persona's needs and user flows it was time to convert them into a high fidelity clickable prototype. I designed the high fidelity screens using Sketch software, and then built and began user testing with InVision prototyping. 

I performed multiple rounds of moderated in-person and remote prototype testing to look for pain points within my design. The people recruited were required to have at least one tattoo already and the desire to get another in order to be eligible for my research. I recruited participants by email for the remote tests and performed a few "guerrilla" style tests at a local coffee shop in order to make sure I had enough data for refinements. Remote tests were conducted with Skype and screen capture software while the in person tests were conducted on my iPhone using inVision and the built in screen recording feature. I also asked a follow up SEQ (single ease question: 1-7 point scale) after each test to better gauge user satisfaction. 

I got strong usability and satisfaction metrics back but I also could clearly see where some issues may be in the design. 

1.  The message page design was creating confusion and hesitation for some participants.

2.  The search layout for finding art/artists was taking too much clicking around, all of the confused participants were able to self correct but I still felt I could improve usability there.

3.  The "nearby" search feature wasn't as obvious as I expected it to be for a few participants.

4.  The messaging artist feature was not considered attractive although it was understood well enough.

Based on results and feedback some of the major refinements my app needed were a complete redesign of the home screen experience and the Nearby Studios Map page. I combined what used to be a separate home screen and main search page into a new home screen that integrated the search features. I changed the wording of the Nearby feature to "Studios Near me" for clarity and changed it visually to fit more consistently with the rest of the app's design and style. I also made design changes to the artist contact and booking feature although those changes were only cosmetic in nature.

I began making refinements to my design and prototype to improve usability and desirability for Ink Tank. I also ran an A/B preference test on Usability Hub to help me decide what direction my UI should be aiming for.

With a visual design direction and a refined protoype I began updating my prototype into a true mockup. Then it was time for another round of prototype testing to help make sure I got the changes right and get some user feedback on the UI of Ink Tank. Testing results and user feedback led to various cosmetic refinements. Design collaboration with other designers that I invited to test my prototype and critique it led to even more refinements. But I wasn't done yet! An accessibility audit to make sure I was hitting AAA benchmarks and contrast/colorblindness testing using the Stark plugin for Sketch led to.... yep, refinements. But I finally had a proper mockup and prototype of Ink Tank.

Please contact me at  crystafac@gmail.com  if you want see more of my work on Ink Tank or have any questions or feedback.